<%@page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@page isELIgnored="false"%> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<title>登录</title>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	</head>
	<body>
		用户登录
		<form action="userlogin.action" method="post" id="ctl00">
			<div>用户名：<input type="text" name="user.uname" /><span style="color: red;"></span></div>
			<div>密码：<input type="password" name="user.pwd" /><span  style="color: red;"></span></div>
			<div>验证码：<img src="imagecode.action"/><input id="imgbutton" type="button" value="换一张" />
				<input name="number" type="text" maxlength="4" id="txtVerifyCode" />
				<span  style="color: red;"></span>
			</div>
			<div><label style="color: red;">${sessionScope.userloginerror }</label></div>
			<div>
				<input type="submit" value="登 录" />
			</div>
		</form>
		<script type="text/javascript" src="../js/jquery-1.4.min.js"></script>
		<script type="text/javascript" src="../js/jquery.validate.js"></script>
		<script type="text/javascript">
		$(function(){
			$("#imgbutton").click(function(){
				$(this).prev().attr("src","imagecode.action?time="+new Date().getTime());
			});
			$('#ctl00').validate({
				rules:{
					"user.uname":{required:true},
					"user.pwd":{required:true},
					"number":{required:true,remote:{
						url:"checkcode.action?dt="+new Date().getTime(),
						type:"post",
						dataType:"json",
						data:{
							number:function(){
								return $('#txtVerifyCode').val();
							}
						}
					}}
				},
				messages:{
					"user.uname":{required:"用户名不能为空"},
					"user.pwd":{required:"密码不能为空"},
					"number":{required:"验证码不能为空",remote:"验证码不正确"}
				},
				errorPlacement:function(error,element){
					error.appendTo(element.next());
				}
			});
		});
		</script>
	</body>
</html>

